<template>
	<!-- sss -->
    <view class="slide-main" @click.native.stop="qiehuanFuns(false)" :style="{opacity:isShow?1:0}">
        <view class="conterLIstA">
			<view class="conterInfo">
			<view class="fanhui" @click="fanhui">
				返回
			</view>
			{{msgList.show_name}}</view>
			<!-- <view class="zongqUnstitle">
				<ld-select :list="chatListvListInfo"
				label-key="show_name" value-key="list_id"
				placeholder="请选择"
				clearable
				v-model="getlist_id"
				@change="selectChange"></ld-select>
				<view>
					<view class=""></view>
					<view class="" @click="goPages('/pages/indeInfo/index?list_id='+list_id)">群信息</view>
				</view>
			</view> -->
			
		</view>
		<!--  -->
		<view class="" style="padding: 0 24rpx;">
			<scroll-view
				 :style="{height:scrollHeight}"
				 scroll-y="true"
				  @scrolltoupper="loadHistory"
				 :scroll-top="scrollTop"
			>
				<view>
					<view class="" v-for="(item,index) in msgList.list">
						<view v-if="index==0" style="padding-bottom: 24rpx;"></view>
						<view>
							<view v-if="item.type==0">
								<chat-list  vonterType="1" @showPic="showPic" goPages="/pages/index/person" :my_data="my_data"  :type="item.msg.type" :list_id="list_id" :mes="item" :mesTime="timestampFormat(item.msg.time+'')+'  '+msgList.show_name" :conter="item.msg.content.text"></chat-list>
							</view>
						</view>
					</view>
				</view>
			</scroll-view>
			
		</view>
		<view class="footerConter">
			<view class="baogangtaiConter">
				<button @click="openshow()">他的联系方式</button>
			</view>
			<view>
				<view class="coLisae">
					<view class="coLisaeInput">
						<input auto-height="true"
									class="coLisaeInput"
						          @input="inputText"
								  placeholder="请输入"
						          :value="textMsg"
						          @focus="textareaFocus"
						          :show-confirm-bar="false"
						          />
						<!-- <input type="text" placeholder="请输入" class="coLisaeInput" /> -->
					</view>
					<view class="sixian" @click.native.stop="sendText">
						发送
					</view>
					 <!-- _this.getScrollContentHeight('show',0); -->
					 <!-- tianitup=!tianitup -->
					<view class="tianitup" :class="tianitup?'xuanzhuan':''" @click.native.stop="qiehuanFuns('show',0,tianitup)"><view class="a">+</view></view>
					
				</view>
				<view class="list-box"
					  :style="{height:tianitup?'auto':'0'}"
				      @click.native.stop="chooseImage">
				  <view class="icon tupian2">
					  <image class="imsges" src="../../static/zhaopian.png" mode=""></image>
				  </view>
				  <view class="tool_text">照片</view>
				</view>
				
				
			</view>
		</view>
		<!-- <view>
			<button open-type="getUserInfo" @getuserinfo="getUserInfo">微信登录</button>
		</view> -->
		<!-- cancel -->
		<logonIs v-if="!token"></logonIs>
		<!-- inputText(e){
			this.$emit('inputText',e)
		},
		textareaFocus(e){
			this.$emit('textareaFocus',e)
		}, -->
		<!-- ischatting=false,chatData -->
		<chatting :show_name="[list_id]" 
		 @inputText="inputText"
		 @textareaFocus="textareaFocus"
		 @selectChange="selectChange"
		  @sendMsg='sendMsg'
		  @textMsgOK="sendText" v-if="ischatting"   @cancel="ischatting=false" :chatListvListInfo="chatListvListInfo"></chatting>
		<Notice v-if="isConteList" :conter="notice" @cancel="isConteList=false"></Notice>
		<view>
			<!-- 普通弹窗 -->
			<uni-popup ref="popup" background-color="#fff">
				<view class="popup-content">
					<view class="text" @click="setClipboardData(phone)">手机号：{{ phone }}</view>
					<view class="text" @click="setClipboardData(wechat_id)">微信号：{{ wechat_id }}</view>
					<view class="text2" @click="close()">取消</view>
				</view>
			</uni-popup>
		</view>
    </view>
	
</template>
<!-- /im/in/getAuthLogin -->
<script>
	
	import {
		Request
	} from '@/utils/request.js';
		import chatList from "../../components/chatList/index.vue"
		import Notice from "../../components/Notice/index.vue"
		import chatting from "../../components/chatting/index.vue"
		import ldSelect from '@/components/UI/ld-select/ld-select.vue'
		import logonIs from "../../components/logon_is.vue"
		import _action from '../../common/_action';
		import _getUserInfo from '../../common/_getUserInfo';
		import _get from '../../common/_get';
		import _data from '../../common/_data';
		import _hook from '../../common/_hook';
		import { mapState,mapMutations } from 'vuex'
		
    export default {
        data() {
           return {
			   uid:'',
			   list_id:"",
			   show_name:'',
			   frList:{
				   list:[],
			   },
			   wechat_id:'',
				phone:'',
			   tianitup:false,
			   msgList: {
			     show_name: '',
			     list: [],
			     type: 0,
			     is_msg: 0,
			     is_action: 0,
			   },
			   // frList
			   msgImgList:[],
			   token:uni.getStorageSync('token'),
			   my_data:{},
			   chatListvListInfo:[],
			   isShow:false,
			   isConteList:false,
			   ischatting:false,
			   textMsg:'',
			   // #ifdef APP-PLUS
			   call: uni.requireNativePlugin('Html5App-TencentCall'),
			   // #endif
			   //
			   scrollTop:0,
				scrollHeight:"0px",
				scrollInfo:{
					
				},
				gongaConter:'',
		   }
        },
		components:{
			chatList,
			Notice,
			logonIs,
			chatting,
			ldSelect
		},
		onLoad (option) {
			
			let _this=this;
		  // this.list_id = option.list_id;
		  if ("uid" in option) {
		    this.uid = option.uid;
		  }
		  // if ("chat_id" in option) {
		  //   this.chat_id = option.chat_id;
		  // }
		    if ("trans" in option) {
				uni.showToast({
					title:'转发成功',
					icon:'none',
					ducation:2000,
				});
		    }
			this.getListId();
			// _get.chatList({
			//   send_data: {
			//   },
			//   is_action_data: 1,
			// })
		},
		onUnload () {
		  /** 这里只保留最新的15条会话记录，以保证初次加载性能 */
		  let _this = this;
		  let chat_data = this.msgList;
		  chat_data.list = chat_data.list.slice(-15);
		  _data.localData(this.list_id, chat_data);
		  /** 去除当前会话的list_id */
		  _data.localData('message_list_id', '');
		  /** 暂停语音播放 */
		  // this.AUDIO.pause();
		  /** 移除监听事件 */
		  uni.$off('data_chat_data_unshift');
		  uni.$off('data_chat_data_push');
		  uni.$off('data_chat_data');
		  uni.$off('data_user_info');
		  uni.$off('data_chat_data_delete');
		  uni.$off('update_text_msg');
		  uni.$off('memberJoinRoom');
		  uni.$off('closeVoiceRoom');
		  clearInterval(_this.timer)
		  clearInterval(_this.redTimer);
		
		  if(_data.data('voice_room_type')){
		      _this.$refs.serving.xiaMai(_this.list_id);
		  }else {
		    _this.$refs.serving && _this.$refs.serving.closeVoiceRoom();
		  }
		},
		mounted () {
		  let _this = this
		  if (this.chat_id) {
			  
		    this.$nextTick(() => {
		      this.scrollToView = "msg" + this.chat_id
		    })
		  }
		  setTimeout(function () {
		    _this.getScrollContentHeight('hide',0);
		  },400)
		},
		created () {
			
			// 
		},
		
		onShow() {
			// _hook.routeSonHook();
			_action.routeTool();
		  let _this = this;
		  /** 先移除监听事件（避免重复触发消息） */
		  uni.$off('data_chat_data_unshift');
		  uni.$off('data_chat_data_push');
		  uni.$off('data_chat_data');
		  uni.$off('data_user_info');
		  uni.$off('data_chat_data_delete');
		  uni.$off('update_text_msg');
		  uni.$off('chat_List');
		  uni.$off('memberJoinRoom');
		  uni.$off('closeVoiceRoom');
		  clearInterval(_this.timer)
		  clearInterval(_this.redTimer)
		  if(_this.list_id){
			  _this.onShowInit()
		  }else{
			uni.$on('chat_List',function (list) {
						  _get.addChat({
						    send_data: {
								list_id:list[0].list_id
						    },
						  })
			   _this.list_id=list[0].list_id;
			   _this.show_name=list[0].show_name;
			   _this.chatListvListInfo=list;
				_this.onShowInit()
			});  
		  }
		 
		  
		  // _this.my_photo = _data.data('cache').local_photo;
		 
		 
		},
		computed: {
			getlist_id () {
			  return [this.list_id]
			},
		  ...mapState({
		    RECORD:state=>state.audio.RECORD,
		      AUDIO:state=>state.audio.AUDIO,
		    RecordTime:state=>state.audio.RecordTime,
		    KeyboardH:state=>state.common.KeyboardHeight
		  }),
		  getServingText(){
		    return _data.data('dragInfo').state == 1 ? '下麦' : '上麦';
		  },
		  myPhoto () {
		    return this.my_photo;
		  },
		  imgRan () {
		    return Math.random();
		  },
		  staticPath () {
		    return _data.staticChat() + this.list_id + '/';
		  },
		  staticVideoImg () {
		    return _data.staticVideoImg()
		  },
		  staticPhoto () {
		    return _data.staticPhoto();
		  },
		  sendMsgClass () {
		    // #ifdef H5
		    return (this.isVoice ? 'hidden' : '');
		    // #endif
		    return (this.isVoice ? 'hidden' : '') || this.textMsg.length ? '' : 'hidden';
		  },
		  iconShow () {
		    return this.textMsg.length ? 'hidden' : 'more';
		  },
		  systemClass(){
		    return this.msgList.type == 1 ? 'sys':'';
		  }
		},
		methods: {
			setClipboardData(e){
				uni.setClipboardData({
					data: e,
					success: function () {
						uni.showToast({
						title: '复制成功',
						icon: 'success',
						duration: 2000
					  })
					}
				});
			},
			
			fanhui(){
				uni.navigateBack({ delta: 1 })
					// uni.switchTab({
					//   url: '/pages/index/index'
					// })
			},
			openshow(){
				this.$refs.popup.open('bottom');
				let _this=this;
				this.$httpSend({
				  path: '/im/get/userData',
				  data: { user_id: _this.uid,type:"POST"},
				  success: function (res) {
						_this.wechat_id = res.wechat_id;
						_this.phone = res.phone;	
				  }
				});
			},
			close(){
				this.$refs.popup.close();
			},
			
			getListId(){
				let _this=this;
				this.$httpSend({
				  path: '/im/message/getListId',
				  data: { user_id: _this.uid,type:"POST"},
				  success ({list_id}) {
					  _this.list_id=list_id;
					   _this.onShowInit()
				  }
				});
			},
			// 更新未读消息
			updataReader(){
				this.$httpSend({
				  path: '/im/message/updataNoReader',
				  data: { list_id: this.list_id },
				  success (res) {
				  }
				});
			},
			goPages(path){
				uni.navigateTo({
					url:path
				})
			},
			// 切换 群聊
			selectChange(e,key){
				this.list_id=e;
				_get.addChat({
				  send_data: {
					list_id:e
				  },
				})
				// this.bindGroup(e);
				this.chatListvListInfo.map((item)=>{
					if(item.list_id==e){
						this.show_name=item.show_name;
					}
				})
				if(e){
					setTimeout(()=>{
						this.onShowInit();
					})
				}
			},
			setTimeoutScrollTop(time){
				let _this=this;
				setTimeout(function () {
				  _this.$nextTick(function () {
				    _this.scrollTop =(new Date()).getTime()/8732;
				  });
				},time||0)
			},
			onShowInit(){
				let _this=this;
				let chat_data = _data.localData(_this.list_id);
				_this.my_data = _data.data('user_info');
				console.log(chat_data,chat_data.list)
				if (chat_data && chat_data.list.length) {
				  _this.scrollAnimation = false;
				  console.log('chat_data.show_name',chat_data.show_name)
				  uni.setNavigationBarTitle({
				    title: chat_data.show_name,
				  });
				  _this.addMsgImgList(chat_data.list);
				  chat_data.list = _this.msgDataHandle(chat_data.list);
				  _this.msgList = chat_data;
							console.log('111');
							console.log('222');
				  _this.receive_list = _this.msgList.receive_list
				  /** 滚动到指定位置 */
				 
				  _this.setTimeoutScrollTop(400)
				  /** 如果是群聊要实时检测群有无禁言 */
				  _this.type = chat_data.type;
				  if (chat_data.type == 1) {
				    _this.getGroupSteate();
				  }
				} else {
				  _get.getChatData({
				    send_data: {
				      list_id: _this.list_id,
				      time: 0,
				      is_up: 1,
				    },
				    is_action_data: 1,
				  });
				}
						
				/** 添加当前的会话list_id */
				_data.localData('message_list_id', this.list_id);
				// 获取未读消息
				_this.updataReader();
				/** 监听会话数据变化 */
				uni.$on('data_chat_data_unshift', function (data) {
				  data = _this.msgDataHandle(data);
				  _this.scrollAnimation = false;
				  let position_id = _this.msgList.list[0].msg.id;
				  _this.msgList.list.unshift(...data);
				  /** 滚动到指定位置 */
				  _this.$nextTick(function () {
				    _this.scrollToView = 'msg' + position_id;
				  });
				});
				
				/** 监听会话数据变化 */
				uni.$on('data_chat_data_push', function (data) {
				  /** 保持页面15条数据，提升性能 */
				  _this.noMore = 0;
				  data = _this.msgDataHandle(data);
				  _this.scrollAnimation = true;
				  _this.msgList.list = data;
				  _this.receive_list = _this.msgList.receive_list;
				  /** 滚动到指定位置 */
				 
				  _this.setTimeoutScrollTop(400)
						
				});
				/** 监听撤回消息 */
				uni.$on('data_chat_data_delete', function (list) {
				  _this.msgList.list = list;
				});
				/** 监听会话数据变化 */
				uni.$on('data_chat_data', function (data) {
				  uni.setNavigationBarTitle({
				    title: data.show_name,
				  });
				  data.list = _this.msgDataHandle(data.list);
				  _this.scrollAnimation = false;
				  _this.msgList = data;
				  _this.receive_list = _this.msgList.receive_list;
						
				  if ( _this.msgList.type == 1) {
				    _this.getGroupSteate();
				  }
				  
				  /** 滚动到指定位置 */
				  _this.setTimeoutScrollTop(0)
				 
				});
				
				/** 监听新的个人数据 */
				uni.$on('data_user_info', function (data) {
				  _this.my_data = data;
				  _this.my_photo = _data.staticPhoto() +_this.my_data.photo
				});
				//监听键盘高度变化
				uni.onKeyboardHeightChange(res => {
				  _this.Keyboard = res.height;
							console.log("_this.Keyboard",_this.Keyboard)
				  if(res.height){
								//
				   _this.getScrollContentHeight("show",0);
				  }else{
				    _this.getScrollContentHeight("hide",0);
				  }
				});
				uni.$on('update_text_msg',function (res) {
				   _this.textMsg +=res.msg
				});
						
				uni.$on('memberJoinRoom',function (res) {
				    _this.$refs.serving.memberJoin(_this.list_id,function () {
				      _this.onLine = true;
				      _this.showServing = true;
				    })
				})
				uni.$on('closeVoiceRoom',function (res) {
				  _this.$refs.serving.closeVoiceRoom()
				})
				_get.getMemberPhotos({list_id:_this.list_id},function (ret) {
				  _this.memberPhotos = ret
				});
			},
		  ...mapMutations(['regSendVoiceEvent','regOnStartEvent','regVudioEndEvent']),
		  getHtml(content){
		    return htmlParser(content);
		  },
		
		  inputText(e){
		    //截取最后一位
		    let str = e.detail.value;
		    let length1 = str.length;
		    let key = str.substr( length1-1,1);
		    if(key && key == '@' && this.msgList.type== 1 && length1 > this.textMsg.length){
		      this.textMsg = str;
		      console.log('跳转到群成员列表');
		      uni.navigateTo({url:'/pages/chat/group_list?list_id='+this.list_id});
		      return true;
		    }
		    this.textMsg = str;
		
		  },
		  qiehuanFuns(_false){
			  if(_false===false){
				  if(this.tianitup){
					 this.tianitup=!this.tianitup
					 setTimeout(()=>{
					 					 this.getScrollContentHeight();
					 }) 
				  }
				  return;
			  }
			  this.tianitup=!this.tianitup
			  setTimeout(()=>{
			  	this.getScrollContentHeight();
			  })
			
		  },
		  getScrollContentHeight(type = 'show',not_return = 1,tianitup){
			  // if(typeof tianitup == 'boolean'){
				 //  this.tianitup=!this.tianitup
				 //  type=tianitup?'hide':'show'
			  // }
			// getScrollContentHeight('show',0,tianitup)
		    let _this = this;
		    let query = uni.createSelectorQuery();
				query.select('.conterLIstA').boundingClientRect();
				query.select('.footerConter').boundingClientRect();
		       uni.getSystemInfo({
		          success:function (res) {
		            console.log("windowHeight:",res.windowHeight);
		            _this.scrollInfo.totall_height = res.windowHeight;
		            query.exec(data => {
		              _this.scrollInfo.input_box_height1  = data[0].height || 0;
		              _this.scrollInfo.input_box_height2  = data[1].height || 0;
						// _this.scrollHeight=(res.windowHeight-data[0].height-data[1].height)+'px';
		              _this.autoHeight(type,not_return)
		            })
		          }
		       })
		  },
		  autoHeight(type,not_return){
		    let _this = this;
			console.log(type)
		    if(type == 'show'){
		      if(this.Keyboard){
		        console.log(" _this.scrollInfo.totall_height:", _this.scrollInfo.totall_height);
		        console.log(" _this.Keyboard:", _this.Keyboard);
		        console.log(" _this.scrollInfo.input_box_height2:", _this.scrollInfo.input_box_height2);
		
		       this.scrollHeight = ( _this.scrollInfo.totall_height - _this.Keyboard-_this.scrollInfo.input_box_height2) + 'px';
		      }else {
		        this.scrollHeight = ( _this.scrollInfo.totall_height - _this.scrollInfo.input_box_height1-_this.scrollInfo.input_box_height2) + 'px';
		      }
		    }else {
		      //content高度 = 屏幕高度-tool高度
		      uni.getSystemInfo({
		        success: function (res) {
		          res.windowHeight = res.windowHeight;
				   _this.scrollHeight = (res.windowHeight - _this.scrollInfo.input_box_height2 - _this.scrollInfo.input_box_height1) + 'px'
		          // if(_this.Keyboard){
		          //   _this.scrollHeight = (res.windowHeight - _this.scrollInfo.Keyboard - _this.scrollInfo.input_box_height2) + 'px'
		          // }else{
		          //   _this.scrollHeight = (res.windowHeight - _this.scrollInfo.input_box_height2) + 'px'
		          // }
		        }
		      });
		      // this.scrollHeight = '100%'
		    }
			_this.isShow=true;
		    if(not_return == 0){
		      console.log('执行高度调整')
			_this.setTimeoutScrollTop(0)
		    }
		  },
		  getGroupSteate(){
		    let _this = this;
		    this.$httpSend({
		      path: '/im/action/groupState',
		      data: { list_id: _this.list_id },
		      success (res) {
				  //notice
		          console.log("_this.vendor_status",_this.vendor_status)
		        _this.msgList.is_msg = res.is_msg;
		        _this.msgList.is_action = res.is_action;
		        _this.msgList.is_niming = res.is_niming;
		        _this.niming_msg = res.is_niming == 0 ? '匿名' : '退出匿名';
		        _this.miaoqiang = res.miaoqiang;
		        _this.vendor_status = res.vendor_status;
		        _this.notice = res.notice;
		        _this.is_main = res.is_main;
		        _this.group_state = res
		        console.log("_this.qiang_time:",res.qiang_time)
		        if(_this.miaoqiang && _this.is_main && res.qiang_time > 0){
		           _this.autoFaRed(res.qiang_time)
		        }
		        if(res.voice_room_state){ //有人发起语音则自动加入
		          //加入视频
		           _this.$refs.serving.memberJoin(_this.list_id,function () {
		              _this.onLine  = true;
		           });
		        }
		
		      }
		    });
		  },
		  videoErrorCallback () {
		
		  },
		  autoVideo (msg) {
		    console.log(msg)
		    this.showVedio = true;
		    this.videoPath = _data.staticChat() + this.list_id + "/" + msg.content.url;
		  },
		  getCard (msg) {
		    console.log(msg.content)
		    console.log(msg.content.user_id)
		    if (msg.content.user_id != undefined) {
		      uni.navigateTo({
		        url: '/pages/details/index?in=1&user_id=' + msg.content.user_id
		      })
		    }
		  },
		  chooseCard () {
		    uni.navigateTo({
		      url: './message/card_list?list_id=' + this.list_id
		    });
		  },
		  imageError (e) {
		    // this.my_photo = _data.staticPhoto() + '/default_photo_path.png';
		    console.log("图片加载失败!", e.detail);
		    let index = e.currentTarget.dataset.id;
		    //替换index对应的图片
		    console.log(this.msgList.list[index].msg.user_info.face)
		    this.msgList.list[index].msg.user_info.face = '/default_photo_path.png';
		  },
		  imageError2 (e) {
		    this.my_photo = _data.staticPhoto() + '/default_photo_path.png';
		  },
		  scrollToDom () {
		    let that = this;
		    let query = uni.createSelectorQuery();
		    query.select('#msg' + that.chat_id).boundingClientRect();
		    query.select('#scrollview').boundingClientRect();
		    query.exec((res) => {
		      that.style.mitemHeight = 0;
		      console.log(res);
		      let rect = res[0];
		      that.style.mitemHeight = that.style.mitemHeight + rect.height + 40;
		      if (that.style.mitemHeight > (that.style.contentViewHeight - 100)) {   //判断子元素高度是否大于显示高度
		        that.scrollTop = that.style.mitemHeight - that.style.contentViewHeight    //用子元素的高度减去显示的高度就获益获得序言滚动的高度
		      }
		    });
		  },
		  //
		  //发起视频聊天
		  videoBut (type) {
		    let content_type = 6;
		    this.call_ret = false;
		    if (type === 'voice') {
		      this.voiceLoading = true;
		      content_type = 7;
		    } else {
		      this.videoLoading = true
		    }
		    let _this = this
		    //console.log("content_type",content_type);
		
		    this.$httpSend({
		      path: '/im/message/sendVideo',
		      data: { list_id: this.list_id, content_type: content_type, _token: uni.getStorageSync('token') },
		      success_action: true,
		      success (res) {
		        if (res.err === 0) {
		          //图片转化
		          res.data.myavatar = _this.staticPhoto + res.data.myavatar;
		          res.data.avatar = _this.staticPhoto + res.data.avatar;
		          _this.getVideo(res.data);
		        } else {
		
		        }
		        console.log(res.data)
		      }
		    });
		  },
		  //调用视频/音频
		  getVideo (data) {
		    let _this = this;
		    // #ifdef APP-PLUS
		    _this.call.openCall(
		            {
		              type: 1,
		              ...data
		            }, ret => {
		              this.doubleClick = false;
		              if (ret) {
		                _this.videPoup = false;
		                _this.voiceLoading = false;
		                console.log(JSON.stringify(ret))
		                if(ret.code == 5 && !_this.payTimer){
		                  console.log('发起付费');
		                  //先扣一次
		                  _get.payVideoAamount({list_id:_this.list_id},function(res){
		                    console.log(res);
		                  },function(res){
		                    console.log(res);
		                  })
		                  _this.payTimer = setInterval(function () {
		                    _get.payVideoAamount({list_id:_this.list_id},function(res){
		                      console.log(res);
		                    },function(res){
		                      console.log(res);
		                      clearInterval(_this.payTimer);//取消收费
		                      _this.payTimer = false;
		                    })
		                  },60000);
		                }
		                if (ret.code == 1 && ret.time != undefined) { //对方或者自己取消
		                  data.time = ret.time;
		                  data.ret_code = ret.code;
		                  console.log(JSON.stringify(data));
		                  _get.cancelCall(data, function (res) {
		                  });
		                }
		              }
		
		            });
		    // #endif
		  },
		  // 发起视频通话
		  videoCall (type) {
		    //判断是否开启语音和视频计费
		    let _this = this;
		    _this.callType = type;
		    _get.getVedioPayConfig({}, function (ret) {
		      let msg1 = '在线视频通话每分钟' + ret.vedio + '元';
		      let msg2 = '在线语音通话每分钟' + ret.voice + '元';
		      _this.popuMsg = msg1;
		      let amount = _this.type == 1 ?  ret.vedio : ret.voice;
		      if(_this.my_data.money < amount) {
		        uni.showToast({
		          title:"账号余额不足以支付1分钟在线"+(_this.type == 1 ? '视频' : '语音')+'通话',
		          duration:3000,
		          icon:"none"
		        })
		        return false;
		      }
		      if (type == 2) _this.popuMsg = msg2
		      if (ret.vedio > 0 || ret.voice > 0) {
		        _this.$refs.popup.open();
		        return true;
		      }
		      _this.confirm()
		    })
		
		    // this.videPoup = true
		    // this.hideDrawer();
		  },
		  confirm () {
		    if(this.doubleClick) return false;
		    this.doubleClick = true;
		    if (this.callType == 1) {
		      this.videoBut('video');
		    } else {
		      this.videoBut('voice');
		    }
		    this.$refs.popup.close();
		  },
		  msgDataHandle (data, type) {
		    for (let i = 0, j = data.length, msg_img; i < j; i++) {
		      if (data[i].type == 0 && data[i].msg.type == 2) {
		        msg_img = this.staticPath + data[i].msg.content.url.replace('_thumb.', '.');
		        if (type) {
		          this.msgImgList.unshift(msg_img);
		        } else {
		          this.msgImgList.push(msg_img);
		        }
		        data[i].msg.content = this.setPicSize(data[i].msg.content);
		      } else if (data[i].type == 0 && data[i].msg.type == 0) {
		        data[i].msg.content.text = this.replaceEmoji(data[i].msg.content.text);
		      }
		    }
		    return data;
		  },
		  addMsgImgList (data) {
		    for (let i = 0, j = data.length, msg_img; i < j; i++) {
		      if (data[i].type == 0 && data[i].msg.type == 2) {
		        this.msgImgList.push(this.staticPath + data[i].msg.content.url.replace('_thumb.', '.'));
		      }
		    }
		  },
		  timestampFormat (time) {
		    return _action.timestampFormat(time);
		  },
		  msgAction (id, user_id) {
		    let _this = this;
		    // switch (_this.msgList.type) {
		    //   case 0:
		    //     if (user_id != _this.my_data.id) {
		    //       return;
		    //     }
		    //     break;
		    //   case 1:
		    //     if (_this.msgList.is_action == 0 && user_id != _this.my_data.id) {
		    //       return;
		    //     }
		    //     break;
		    //   default:
		    //     return;
		    //     break;
		    // }
		    uni.showActionSheet({
		      itemList: ['撤回','收藏'],
		      success: function (res) {
		        switch (res.tapIndex) {
		          case 0:
		            _this.$httpSend({
		              path: '/im/message/withdraw',
		              data: { list_id: _this.list_id, type: _this.msgList.type, msg_id: id, },
		              success_action: true,
		              success (res) {
		                uni.showToast({
		                  title: res.msg,
		                  icon: 'none',
		                  duration: 1500
		                });
		              }
		            });
		            break;
		          case 1:
		            console.log("收藏");
		            _this.$httpSend({
		              path: '/im/vendor/saveStore',
		              data: { list_id: _this.list_id, type: _this.msgList.type, msg_id: id, },
		              success_action: true,
		              success (res) {
		                uni.showToast({
		                  title: res.msg,
		                  icon: 'none',
		                  duration: 1500
		                });
		              }
		            });
		            break;
		            //收藏
		          default:
		            break;
		        }
		      },
		      fail: function (res) {
		        //console.log(res.errMsg);
		      }
		    });
		  },
		  goDetails (user_id,row) {
		    /** 如果是群聊，没有权限的话，查看不了其他会员信息 */
		    if (this.msgList.type == 1 && (this.msgList.is_action == 0 || row.msg.is_niming == 1)) {
		      uni.showToast({
		        title: '没有权限查看',
		        icon: 'none',
		        duration: 1000
		      });
		      return;
		    }
		    uni.navigateTo({
		      url: ('../details/index?user_id=' + user_id),
		    })
		  },
		
		  // 接受消息(筛选处理)
		  screenMsg (msg) {
		    //从长连接处转发给这个方法，进行筛选处理
		    if (msg.type == 1) {
		      // 系统消息
		      switch (msg.msg.type) {
		        case 0:
		          this.addSystemTextMsg(msg);
		          break;
		        case 5:
		          this.addSystemRedEnvelopeMsg(msg);
		          break;
		      }
		    } else if (msg.type == 0) {
		      // 用户消息
		      switch (msg.msg.type) {
		        case 0:
		          this.addTextMsg(msg);
		          break;
		        case 1:
		          this.addVoiceMsg(msg);
		          break;
		        case 2:
		          this.addImgMsg(msg);
		          break;
		        case 5:
		          this.addRedEnvelopeMsg(msg);
		          break;
		      }
		      //console.log('用户消息');
		      //非自己的消息震动
		      if (msg.msg.user_info.uid != this.my_data.id) {
		        //console.log('振动');
		        uni.vibrateLong();
		      }
		    }
		    let _this =this
			_this.setTimeoutScrollTop(0)
		  },
		
		  //触发滑动到顶部(加载历史信息记录)
		  loadHistory () {
		    if (this.isHistoryLoading || this.noMore) {
		      return;
		    }
		    let _this = this;
		    this.isHistoryLoading = true; //参数作为进入请求标识，防止重复请求
			console.log(_this.msgList.list[0].msg)
		    _get.getChatData({
		      send_data: {
		        list_id: _this.list_id,
		        time: _this.msgList.list[0].msg.time,
		        is_up: 0,
		      },
		      callback (data) {
		        if (data.list.length < 15) {
		          _this.noMore = 1;
		        }
		        _this.isHistoryLoading = false;
		      },
		      is_action_data: 0,
		    });
		  },
		
		  //处理图片尺寸，如果不处理宽高，新进入页面加载图片时候会闪
		  setPicSize (content) {
		    // 让图片最长边等于设置的最大长度，短边等比例缩小，图片控件真实改变，区别于aspectFit方式。
		    let maxW = uni.upx2px(350);//350是定义消息图片最大宽度
		    let maxH = uni.upx2px(350);//350是定义消息图片最大高度
		    if (content.w > maxW || content.h > maxH) {
		      let scale = content.w / content.h;
		      content.w = scale > 1 ? maxW : maxH * scale;
		      content.h = scale > 1 ? maxW / scale : maxH;
		      let url_array = content.url.split('.');
		      if (content.url.indexOf('_thumb.') == -1) {
		        content.url = url_array[0] + '_thumb.' + url_array[1];
		      }
		    }
		    return content;
		  },
		  //更多功能(点击+弹出)
		  showMore () {
		    this.isVoice = false;
		    this.hideEmoji = true;
		    if (this.hideMore) {
		      this.hideMore = false;
		      this.openDrawer();
		    } else {
		      this.hideDrawer();
		    }
		  },
		  // 打开抽屉
		  openDrawer () {
		    let _this = this;
		    this.popupLayerClass = 'showLayer';
		    this.hideMore = false;
		    setTimeout(function () {
		      //console.log("scorll...")
		      _this.getScrollContentHeight('show',0);
		    },150)
		  },
		  // 隐藏抽屉
		  hideDrawer (not_return =0,type="hide") {
		    //判断时间
		    if(not_return == 3){
		        let time = (new Date()).getTime();
		        if(this.doubleTime.flag){
		          this.doubleTime.firstTime = time
		          this.doubleTime.flag = false;
		        }else {
		          this.doubleTime.towTime = time
		          this.doubleTime.flag = true;
		        }
		      let timeBucket = this.doubleTime.towTime -  this.doubleTime.firstTime;
		       console.log('timeBucket:',timeBucket)
		        if(timeBucket < 200 && this.doubleTime.flag){
		          //第二次进来
		          clearTimeout(this.timer);
		          this.doubleTime.towTime = '';
		          this.doubleTime.firstTime = '';
		           this.sendChuoYiChuoMsg();
		          // this.textMsg = '[戳一戳]'
		          // this.sendMsg(this.textMsg,0);
		          // this.textMsg = ''
		          // //发送戳一戳
		          return false;
		       }
		      let _this = this;
		      this.timer = setTimeout(function () {
		        _this.toHideDrawer(not_return,type)
		      },280)
		    }else {
		      this.toHideDrawer(not_return,type)
		    }
		  },
		  sendChuoYiChuoMsg(){
		    _get.sendChuoYiChuoMsg({list_id:this.list_id},function () {
		      
		    })
		  },
		  toHideDrawer(not_return =0,type="hide") {
		    this.popupLayerClass = '';
		    setTimeout(() => {
		      this.hideMore = true;
		      this.hideEmoji = true;
		      this.getScrollContentHeight(type,not_return);
		    }, 150);
		  },
		  // 选择图片发送
		  chooseImage () {
		    this.getImage('album');
		  },
		  //拍照发送
		  camera () {
		    this.getImage('camera');
		  },
		  //拍摄视频发送
		  video () {
		    uni.chooseVideo({
		      success: (res) => {
		        let min = parseInt(res.size / 60),
		                sec = res.size % 60;
		        min = min < 10 ? '0' + min : min;
		        sec = sec < 10 ? '0' + sec : sec;
		        let msg = { url: res.tempFilePath, length: (min + ':' + sec) };
		        this.sendMsg(msg, 3);
		      }
		    })
		  },
		  //发红包
		  handRedEnvelopes () {
		    // this.hideDrawer(1);
		    //console.log(111)
		        let url =  'message/hand?list_id=' + this.list_id+'&msg_type='+this.msgList.type;
		        if(this.vendor_status)url =  'message/hand_pin?list_id=' + this.list_id+'&msg_type='+this.msgList.type;;
		        uni.navigateTo({
		          url: url
		        });
		  },
		  //转账
		  transfers () {
		    //TODO跳转到转账页面
		  },
		  //选照片 or 拍照
		  getImage (type) {
		    this.hideDrawer(1);
		    uni.chooseImage({
		      sourceType: [type],
		      sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
		      success: (res) => {
		        for (let i = 0; i < res.tempFilePaths.length; i++) {
		          uni.getImageInfo({
		            src: res.tempFilePaths[i],
		            success: (image) => {
		              //console.log(image.width);
		              //console.log(image.height);
		              let msg = { url: res.tempFilePaths[i], w: image.width, h: image.height };
		              this.sendMsg(msg, 2);
		            }
		          });
		        }
		      }
		    });
		  },
		  // 选择表情
		  chooseEmoji () {
		    this.hideMore = true;
		    if (this.hideEmoji) {
		      this.hideEmoji = false;
		      this.openDrawer();
		    } else {
		      this.hideDrawer();
		    }
		  },
		  //添加表情
		  addEmoji (em) {
		    this.textMsg += em.alt;
		  },
		
		  //获取焦点，如果不是选表情ing,则关闭抽屉
		  textareaFocus () {
		    let _this = this;
		    _this.hideDrawer(0,'show');
		    return;
		    if (_this.popupLayerClass == 'showLayer' && this.hideMore == false) {
		      _this.hideDrawer();
		    }
		  },
		
		  // 发送文字消息
		  sendText () {
		    this.hideDrawer(1);//隐藏抽屉
		    if (!this.textMsg) {
		      return;
		    }
		    this.sendMsg('', 0);
		    //清空输入框
		    this.textMsg = '';
		  },
		
		  //替换表情符号为图片
		  replaceEmoji (str) {
		    let replacedStr = str.replace(/\[([^(\]|\[)]*)\]/g, (item, index) => {
		      // console.log("item: " + item);
		      for (let i = 0; i < this.emojiList.length; i++) {
		        let row = this.emojiList[i];
		        for (let j = 0; j < row.length; j++) {
		          let EM = row[j];
		          if (EM.alt == item) {
		            //在线表情路径，图文混排必须使用网络路径，请上传一份表情到你的服务器后再替换此路径
		            //比如你上传服务器后，你的100.gif路径为https://www.xxx.com/emoji/100.gif 则替换onlinePath填写为https://www.xxx.com/emoji/
		            let imgstr = '<img style="width:22px;height:22px;" src="' + _data.data('static_url') + '/static/emoji/' + EM.url + '">';
		            // console.log("imgstr: " + imgstr);
		            return imgstr;
		          }
		        }
		      }
		    });
			
		    // display: flex;
		    return replacedStr;
		  },
		  showQiang(){
		    this.$refs.qiang.open();
		  },
		  autoFaRed(num){
		    let _this = this;
		    let time = num * 1000;
		    if(time <=0) return false;
		    if(_this.timer) clearInterval(_this.redTimer);
		    _this.redTimer = setInterval(function () {
		      _get.autoBigRed({list_id:_this.list_id},function () {})
		    },num * 1000)
		  },
		  goQiang(e){
		    let _this = this;
		    e.list_id = _this.list_id;
		      _get.updateMiaoqiang(e,function (res) {
		        _this.miaoqiang = e.status;
		        console.log(e)
		        if(e.status == 1){
		          console.log('发包.......')
		          _this.autoFaRed(e.num)
		        }else {
		          clearInterval(_this.redTimer);
		        }
		        setTimeout(function () {
		          uni.showToast({
		            title: '操作成功',
		            duration: 2000
		          });
		          _this.$refs.qiang.close();
		        },500)
		      });
		  },
		  // 发送消息
		  sendMsg (content, type) {
		    // uni.showLoading();
		    let _this = this,
		            sendMsg = content;
		    ((callback) => {
		
		      switch (type) {
		              /** 文字/表情消息 */
		        case 0:
		          let msg = this.textMsg.replace(/</g, '&lt;');
		          sendMsg = { text: msg };
		          callback();
		          break;
		              /** 语音/图片/视频/文件 */
		        case 1:
		        case 2:
		        case 3:
		        case 4:
		          uni.showLoading({ title: '发送中' })
		          _this.$httpSendFile({
		            type: 0,
		            local_url: sendMsg.url,
		            data: {
		              'list_id': _this.list_id,
		            },
		            success (data) {
		              uni.hideLoading();
		              sendMsg.url = data.save_name;
		              if ('save_gif_path' in data) sendMsg.save_pic_path = data.save_gif_path;
		              console.log('success');
		              callback();
		            }
		          });
		          break;
		              /** 红包消息 */
		        case 5:
		          break;
		
		        default:
		          break;
		      }
		    })(() => {
		      _this.$httpSend({
		        path: '/im/message/textMsg',
		        data: {
		          list_id: _this.list_id,
		          content_type: type,
		          content: JSON.stringify(sendMsg),
		        },
		        success_action: true,
		        success (res) {
		          // uni.hideLoading();
				  _this.ischatting=false;
		          switch (res.err) {
		            case 0:
		              if (type == 1) {
		                _action.playVoice('/static/voice/voice.mp3');
		              }
		              break;
		            case 1:
		              uni.showModal({
		                title: '好友提示',
		                confirmText: '发送好友申请',
		                content: res.msg,
		                success: function (res) {
		                  if (res.confirm) {
		                    uni.navigateTo({
		                      url: ('../friend/apply?user_id=' + _data.localData(_this.list_id).obj_id + '&is_type=0'),
		                    });
		                  }
		                }
		              });
		              break;
		            case 2:
		              uni.showModal({
		                content: res.msg,
		              });
		              let data = _data.localData(data.list_id);
		              data.is_msg = 1;
		              _this.msgList.is_msg = 1;
		              _data.localData(data.list_id, data);
		              break;
		            default:
		              break;
		          }
		        }
		      });
		    });
		  },
		
		  // 添加文字消息到列表
		  addTextMsg (msg) {
		    this.msgList.list.push(msg);
		  },
		  // 添加图片消息到列表
		  addImgMsg (msg) {
		    this.msgImgList.push(this.staticPath + msg.msg.content.url);
		    msg.msg.content = this.setPicSize(msg.msg.content);
		    this.msgList.list.push(msg);
		  },
		  addRedEnvelopeMsg (msg) {
		    this.msgList.push(msg);
		  },
		  // 添加系统文字消息到列表
		  addSystemTextMsg (msg) {
		    this.msgList.list.push(msg);
		  },
		  // 添加系统红包消息到列表
		  addSystemRedEnvelopeMsg (msg) {
		    this.msgList.list.push(msg);
		  },
		  openRed (params) {
		    let _this = this;
		    _this.luckbtn = "luckbtn";
		    uni.showLoading({
		      title: '加载中...'
		    });
		    //TODO 判断是哪种红包
		      if(this.vendor_status == 1){
		          _get.getLeiHongBao(params, function (ret) {
		              _this.receive_list.push(params.rid);
		              _this.msgList.receive_list = _this.receive_list;
		              _data.localData(_this.list_id, _this.msgList);
		              console.log(ret);
		              uni.$emit('data_user_info', ret);
		              _data.data('user_info', ret);
		              setTimeout(function () {
		                  _this.luckbtn = "";
		                  _this.closeRedEnvelope();
		                  _this.toDetails(params.rid);
		              }, 1000)
		          }, function (ret) {
		              setTimeout(function () {
		                  _this.luckbtn = "";
		                  _this.closeRedEnvelope();
		                  _this.toDetails(params.rid);
		              }, 1000);
		          });
		      }else {
		          _get.getHongBao(params, function (ret) {
		              _this.receive_list.push(params.rid);
		              _this.msgList.receive_list = _this.receive_list;
		              _data.localData(_this.list_id, _this.msgList);
		              console.log(ret);
		              uni.$emit('data_user_info', ret);
		              _data.data('user_info', ret);
		              setTimeout(function () {
		                  _this.luckbtn = "";
		                  _this.closeRedEnvelope();
		                  _this.toDetails(params.rid);
		              }, 1000)
		          }, function (ret) {
		              setTimeout(function () {
		                  _this.luckbtn = "";
		                  _this.closeRedEnvelope();
		                  _this.toDetails(params.rid);
		              }, 1000);
		          });
		      }
		
		    uni.hideLoading();
		  },
		  sendSystemMsg (content, type) {
			  alert(2)
		    let lastid = this.msgList.list[this.msgList.list.length - 1].msg.id;
		    lastid++;
		    let row = { type: "system", msg: { id: lastid, type: type, content: content } };
		    this.screenMsg(row);
		  },
		  //领取详情
		  toDetails (rid) {
		    uni.navigateTo({
		      url: 'message/details?rid=' + rid + '&list_id=' + this.list_id
		    })
		  },
		  // 预览图片
		  showPic (msg) {
			  uni.previewImage({
			    indicator: "none",
			    current: this.staticPath + msg.url.replace('_thumb', ''),
			    urls: msg.imgList
			  });
		    // uni.previewImage({
		    //   indicator: "none",
		    //   current: this.staticPath + msg.content.url.replace('_thumb', ''),
		    //   urls: this.msgImgList
		    // });
		  },
		  discard () {
		    return;
		  },
		  sayCall(){
		    let status = 0; //默认关闭匿名
		    console.log('this.msgList.is_niming:',this.msgList.is_niming)
		    if(this.msgList.is_niming == 0){
		      uni.showLoading({'title':'匿名开启中...'});
		      status = 1;
		    }
		    let _this = this;
		    _get.updateUserSayType({list_id:this.list_id,status:status},function () {
		      if(_this.msgList.is_niming == 0){
		        uni.showToast({'title':'开启成功','image':'/static/theme/default/my/niming.png',duration:2000});
		        _this.msgList.is_niming = 1;
		
		        _this.niming_msg = '退出匿名';
		      }else {
		        _this.msgList.is_niming = 0;
		        _this.niming_msg = '匿名';
		      }
		      _this.textareaFocus();//隐藏抽屉
		    },function (ret) {
		      uni.showToast({'title':ret.msg,icon:'none',duration:2000})
		    });
		  },
		  scrollEven(e){
		  },
		  zhendong(){
		    _get.zhendong({list_id:this.list_id},function (res) {
		      
		    },function (res) {
		       uni.showToast({title:res.msg,duration:2000,icon:'none'})
		    })
		  },
		  group_info(){
		    uni.navigateTo({
		      url: './message/more?list_id=' + this.list_id + '&type=' + this.msgList.type,
		    });
		  },
		  toUserDetail(item){
		    if (this.msgList.type == 1 && (this.msgList.is_action == 0)) {
		      uni.showToast({
		        title: '没有权限查看',
		        icon: 'none',
		        duration: 1000
		      });
		      return;
		    }
		    uni.navigateTo({
		      url: ('../details/index?user_id=' + item.user_id+'&type=1&list_id='+this.list_id+"&is_action="+this.is_action),
		    });
		  },
		  getServing(){
		      //判断权限
		      if (this.msgList.type == 1 && (this.msgList.is_action == 0) &&  this.group_state && this.group_state.can_shangmai == 0) {
		          uni.showToast({
		              title: '此群被设置为只有群主和管理员才能上麦',
		              icon: 'none',
		              duration: 1000
		          });
		          return;
		      }
		    let _this = this;
		    if(this.onLine){  //在房间里直开启
		      _this.showServing = true;
		      console.log("onLine.....")
		      this.$refs.serving.joinOnline(this.list_id);
		      return true;
		    }
		    console.log("_this.servingState:",_this.servingState)
		    if(_this.servingState  == 1){
		      //下麦
		      _this.showServing = false;
		      _this.$refs.serving.xiaMai(this.list_id);
		    }else {
		      //上麦
		      console.log("joinRoom....")
		      _this.showServing = true;
		      this.$refs.serving.joinRoom(this.list_id);
		    }
		  },
		  setSeringState(detail){
		    console.log("this.servingState:",JSON.stringify(detail))
		     this.servingState = detail.state
		  }
		},
		watch: {},
		onNavigationBarButtonTap (e) {
		  uni.navigateTo({
		    url: './message/more?list_id=' + this.list_id + '&type=' + this.msgList.type,
		  });
		}
    }
</script>

<style scoped>
	.conteTitle{
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #9298A0;
		line-height: 36rpx;
		text-align: center;
		font-style: normal;
		text-transform: none;
		margin-bottom: 32rpx;
		padding-top: 20rpx;
	}
	.footerConter{
		width: 750rpx;
		background: #FFFFFF;
		box-shadow: 0rpx -10rpx 10rpx 1rpx rgba(0,0,0,0.04);
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		padding: 0 24rpx;
		box-sizing: border-box;
		padding-bottom: 68rpx;
	}
	.baogangtaiConter{
		display: flex;
		align-items: left;
		padding-top: 34rpx;
		margin-bottom: 16rpx;
	}
	.baogangtaiConter button{
		font-size: 28rpx;
		line-height: 36rpx;
		height: 36rpx;
	}
	.baogangtaiList{
		width: 166rpx;
		text-align: center;
		line-height: 56rpx;
		height: 56rpx;
		border-radius: 32rpx 32rpx 32rpx 32rpx;
		border: 1rpx solid #C4CAD4;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #9298A0;
		text-align: center;
		margin-right: 16rpx;
		font-style: normal;
		text-transform: none;
	}
	.coLisaeInput{
		width: 400rpx;
		margin-right: 15rpx;
		height: 80rpx;
		background: #F2F4F7;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 28rpx;
		color: #616974;
		line-height: 36rpx;
		padding-left: 24rpx;
		box-sizing: border-box;
		line-height: 80rpx;
		border-radius: 40rpx 40rpx 40rpx 40rpx;
	}
	.coLisae{
		display: flex;
		justify-content: space-between;
	}
	.baogangtaiList.active{
		background: #F8E9E9;
		color: #DD6262;
		border: 1px solid #F8E9E9;
	}
    .slide-main {
        width: 100%;
        height: 100vh;
		overflow: hidden;
    }
	.conterLIstA{
		padding-top: 90rpx;
		background-color: #236AE5;
	}
	.sixian{
		width: 164rpx;
		height: 80rpx;
		background: #E8F0FF;
		border-radius: 10rpx 10rpx 10rpx 10rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 28rpx;
		color: #256FF3;
		text-align: center;
		line-height: 80rpx;
		text-align: center;
		font-style: normal;
		text-transform: none;
		position: relative;
	}
	.sixian .conLis{
		width: 46rpx;
		height: 36rpx;
		position: absolute;
		font-family: SF UI Display, SF UI Display;
		font-weight: 500;
		font-size: 22rpx;
		color: #FFFFFF;
		line-height: 36rpx;
		text-align: center;
		font-style: normal;
		text-transform: none;
		right: -23rpx;
		top: -18rpx;
		background: #DD6262;
		border-radius: 18rpx 18rpx 18rpx 18rpx;
	}
	.conterInfo{
		font-size: 32rpx;
		color: #fff;
		font-weight: 500;
		text-align: center;
		line-height: 90rpx;
		position: relative;
		box-sizing: border-box;
		padding-left: 25rpx;
	}
	.conterInfo .fanhui{
		position: absolute;
		font-size: 30rpx;
		left: 24rpx;
	}
	.zongqUnstitle{
		width: 750rpx;
		height: 114rpx;display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 24rpx;
		box-sizing: border-box;
		background: linear-gradient( 180deg, #D3E1FF 0%, #FFFFFF 100%);
		border-radius: 32rpx 32rpx 0px 0px;
		border: 1px solid #DCE1E8;
	}
	.tianitup{
		line-height: 80rpx;
		font-size: 30rpx;
		display: flex;
		align-items: center;
		margin-left: 20rpx;
	}
	.tianitup .a{
		width: 50rpx;
		height: 50rpx;
		border-radius: 50%;
		font-size: 40rpx;
		line-height: 50rpx;
		text-align: center;
		background-color: #E8F0FF;
		color: #256FF3;
	}
	.tianitup.xuanzhuan{
		transition: .2s;
		transform: rotate(-90deg);
	}
	.list-box {
	  height: 100rpx;
	  transition: .4s;
	  overflow: hidden;
	  width: 25%;
	}
	.list-box .imsges{
		width: 100rpx;
		height: 100rpx;
	}
	.tool_text{
		text-align: center;
		font-size: 28rpx;
		margin-top: -20rpx;
		width: 100rpx;
	}
	.popup-content {
			align-items: center;
			justify-content: center;
			padding:0 30rpx;
			height: 250rpx;
			background-color: #fff;
	}
	.text{
		height: 82rpx;
		line-height: 82rpx;	
		text-align: center;
		border-bottom:1rpx solid #eee ;
	}
	.text2{
		height: 92rpx;	
		line-height: 92rpx;	
		text-align: center;
		border-top:8rpx solid #eee;
	}
</style>